<template>
  <!-- 作业轴弹出层 -->
  <m-win wd="1100" v-model:window_open="val.win_zy" :title="val.zyname">
    <template #content>
      <van-tabs
        v-model:active="active"
        @click-tab="ct.load_zyvan"
        v-if="val.ldata.data?.length >= 2"
      >
        <template v-for="(item, key) in val.ldata.data">
          <van-tab :title="`[P${key + 1}]${item?.bz}`" :name="key" />
        </template>
      </van-tabs>
      <div class="_jsbox _mbbox">
        <template v-if="val.ldata2.vt == 'video'">
          <div class="_videobox">
            <div class="_iframediv">
              <n-flex style="justify-content: center; align-items: center">
                <n-switch
                  v-if="cfg.mobile == false"
                  v-model:value="val.sw_loadvideo"
                  @update:value="ct.updloadvideo"
                >
                  <template #checked>自动播放视频</template>
                  <template #unchecked>手动播放视频</template>
                </n-switch>
                <a
                  target="_blank"
                  :href="`https://www.bilibili.com/video/${val.ldata2.bv}/?p=${val.ldata2?.fp}`"
                >
                  <n-button size="small">在哔哩哔哩播放</n-button>
                </a>
              </n-flex>
              <a
                target="_blank"
                :href="`https://www.bilibili.com/video/${val.ldata2.bv}/?p=${val.ldata2?.fp}`"
              >
              </a>
              <iframe
                v-if="val.iframe == true"
                style="margin-top: 0.3em"
                class="_iframe"
                :src="`https://www.bilibili.com/blackboard/html5mobileplayer.html?high_quality=1${
                  val.sw_loadvideo == true && cfg.mobile == false
                    ? `&autoplay=1`
                    : `&posterFirst=1&autoplay=0`
                }&bvid=${val.ldata2.bv?.split('?')?.[0]}&p=${val.ldata2?.fp}`"
                scrolling="no"
                border="0"
                frameborder="no"
                framespacing="0"
                allowfullscreen="true"
              >
              </iframe>
            </div>
            <div class="_textdiv">
              <n-h3>装备配置</n-h3>
              <div class="_box_div">
                <div class="_workdiv">
                  <img
                    :src="ct.img[val.ldata2.yq ?? '不填']"
                    :class="`work_yqimg_${val.ldata2.yq ?? '不填'}`"
                  />
                  <div class="_workw">{{ val.ldata2.yq }}</div>
                </div>
                <template v-for="item in val.ldata.icon">
                  <div class="_workdiv">
                    <img :src="cfg.function.ava(item)" />
                    <div class="_workw">{{ val.ldata2?.weapon?.[item] }}</div>
                  </div>
                </template>
              </div>

              <template v-if="val.ldata2?.content?.length >= 1">
                <n-h3>文字轴 / 介绍补充</n-h3>

                <pre class="_box_div" style="margin: 0px">{{ val.ldata2?.content }}</pre>
              </template>
            </div>
          </div>
        </template>
      </div>
    </template>
    <template #footer>
      <n-badge :value="val.ldata2.gj ?? 0">
        <n-button :size="cfg.sizebtn" type="gt_n">
          <n-icon size="20" :component="MdThumbsUp" />
        </n-button>
      </n-badge>
      <n-popselect
        :options="ct.editop"
        @update:value="ct.editopfunc"
        placement="top"
        trigger="click"
      >
        <n-button :size="cfg.sizebtn" type="gt_y">
          <span>编辑</span>
        </n-button>
      </n-popselect>
    </template>
  </m-win>

  <!-- 管理菜单弹出层 -->
  <m-win v-model:window_open="val.win_admin" :title="`管理菜单`">
    <template #content>
      <div class="stitle">· 管理菜单 ·</div>
      <div class="_box0">
        <n-button @click="ct.del_dxdmg">重置({{ val.ck_boss }})刀型伤害</n-button>
      </div>
    </template>
    <template #footer> </template>
  </m-win>

  <!-- 作业编辑弹出层 -->
  <m-win v-model:window_open="val.win_edit" :title="`编辑作业`">
    <template #content>
      <n-spin :show="val.edit_loading">
        <div class="_box0">
          <component :is="edit" :obj="val.ldata3 ?? {}"></component>
        </div>
      </n-spin>
    </template>
    <template #footer>
      <n-spin :show="val.edit_loading">
        <n-button @click="ct.save_edit" type="gt_y">保存</n-button>
      </n-spin>
    </template>
  </m-win>

  <!-- 协力讨伐表弹出层 -->
  <m-win v-model:window_open="val.win_olist" :title="`协力讨伐表`">
    <template #content>
      <div class="_box0">
        <component :is="olist" :cp="true" @load_zy="ct.load_oldzy"></component>
      </div>
    </template>
  </m-win>

  <!-- 作业上传弹出层 -->
  <m-win v-model:window_open="val.win_new" :title="`上传新作业`">
    <template #content>
      <n-spin :show="val.edit_loading">
        <div class="_box0">
          <component :is="edit" :obj="val.ldata3 ?? {}"></component>
        </div>
      </n-spin>
    </template>
    <template #footer>
      <n-spin :show="val.edit_loading">
        <n-button @click="ct.post_new" type="gt_y">上传</n-button>
      </n-spin>
    </template>
  </m-win>
  <div class="_mbbox boxgap">
    <div class="nbox1">
      <n-grid x-gap="16" y-gap="16" cols="6" item-responsive>
        <!-- 顶部按钮 -->
        <n-gi span="6">
          <div class="_pcmw _topbtn_box mauto">
            <n-button
              v-if="val.mode != 'boss'"
              type="gt_y"
              :size="cfg.sizebtn"
              @click="ct.click_new"
              >投稿</n-button
            >
            <n-button type="gt_n" @click="ct.modesw" :size="cfg.sizebtn">模式</n-button>
            <n-button
              v-if="val.mode != 'boss'"
              type="gt_n"
              @click="val.win_olist = true"
              :size="cfg.sizebtn"
              >往期一览</n-button
            >
          </div>
        </n-gi>
        <!-- 赛季选择器 -->
        <n-gi span="6" v-if="val.mode != 'boss'">
          <div class="_pcmw mauto">
            <n-select
              class="_season_select"
              v-model:value="val.click_season"
              :options="val.season_list"
              @update:value="ct.click_seaosn"
            />
          </div>
        </n-gi>
        <!-- 属性选择区域 -->
        <n-gi span="6" v-if="cfg.mobile == false || val.mode == 'boss'">
          <div class="_pcmw _sstag_box mauto">
            <template v-for="(item, index) in ct.ss">
              <div
                class="nosl m_tagbox"
                :class="{ m_tagbox_active: ct.isstr(item, val.ck_em) }"
                @click="ct.click_embtn(item)"
              >
                <img height="11" class="team_ss_icon" :src="ct.img[item]" />
                <span
                  ><template v-if="item == '五彩'">彩</template
                  ><template v-else>{{ item }}</template
                  ><span class="_hide_w350">队</span></span
                >
              </div>
            </template>
          </div>
        </n-gi>

        <!-- 首领选择区域 -->
        <n-gi span="6" v-if="val.mode != 'boss'">
          <div class="nosl _pcmw _bossct_box mauto">
            <template v-for="item in val.boss_list">
              <n-gi @click="ct.click_boss(item.name, item.element)">
                <div style="position: relative">
                  <div class="zy_em">
                    <img height="13" :src="ct.img[item?.element]" />
                  </div>
                  <div class="zy_img" :class="val.ck_boss == item.name ? 'boss_ck' : ''">
                    <div class="boss_box2">
                      <img
                        style="height: 100%; z-index: 99"
                        :src="`${cfg.cdn2}?file=${
                          cfg.bossnamelist?.[item.name]?.icon
                        }&h=100`"
                      />
                    </div>
                  </div>
                </div>
              </n-gi>
            </template>
          </div>
          <div style="margin-top: 22px">
            <template v-if="cfg.mobile == true">
              <n-button :size="cfg.sizebtn" @click="val.win_mbset = true"
                >额外开关设置</n-button
              >

              <m-win v-model:window_open="val.win_mbset" title="额外参数开关设置">
                <template #content>
                  <div class="_mbbox">
                    <van-cell center title="队伍炽热伤害显示">
                      <template #right-icon>
                        <van-switch v-model="val.sw_fevermode" />
                      </template>
                    </van-cell>
                    <van-cell center title="显示已隐藏旧作业">
                      <template #right-icon>
                        <van-switch
                          v-model="val.sw_hidemode"
                          @update:model-value="ct.updhidemode"
                        />
                      </template>
                    </van-cell>
                    <van-cell center title="已开花角色显示开花头像">
                      <template #right-icon>
                        <van-switch
                          v-model="val.sw_mythavamode"
                          @update:model-value="ct.updmyth"
                        />
                      </template>
                    </van-cell>
                    <van-cell center title="按照伤害排序（默认点赞数）">
                      <template #right-icon>
                        <van-switch
                          v-model="val.px_dmgmode"
                          @update:model-value="ct.px_dmg"
                        />
                      </template>
                    </van-cell>
                  </div>
                </template>
              </m-win>
            </template>
          </div>
        </n-gi>
        <n-gi span="6" v-if="val.mode == 'boss'">
          <div class="nosl _pcmw mauto">
            <n-select
              placeholder="选择首领"
              v-model:value="val.click_boss"
              :options="val.bossmode_list"
              @update:value="ct.click_bossmodesl"
            ></n-select>
          </div>
        </n-gi>
      </n-grid>

      <template v-if="cfg.mobile != true">
        <n-flex class="_swflex" style="gap: 5px">
          <n-checkbox v-model:checked="val.sw_fevermode" label="炽热伤害" />
          <n-checkbox
            v-model:checked="val.sw_hidemode"
            @update:checked="ct.updhidemode"
            label="显示旧轴"
          />

          <n-checkbox
            v-model:checked="val.sw_mythavamode"
            @update:checked="ct.updmyth"
            label="开花头像"
          />

          <n-checkbox
            v-model:checked="val.px_dmgmode"
            @update:checked="ct.px_dmg"
            label="伤害排序"
          />
        </n-flex>
      </template>
      <div class="gapdef _teamdiv" style="gap: 8px" v-if="val.data?.length >= 1">
        <div v-if="val.click_season < val.newseason" class="nbox3">
          查看旧赛季数据请勾选 [ 显示旧轴 ]
        </div>
        <template v-for="item in val.data">
          <div class="_teambox nosl">
            <div class="_rolelist">
              <template v-for="(item2, key2) in item.icon">
                <template v-if="key2 == 0">
                  <div class="_roleyc">
                    <img class="_img1" :src="ct.img[ct.get_wpycl(item2, item.list[0])]" />
                    <div class="_yctext">{{ ct.get_wpycz(item2, item.list[0]) }}</div>
                  </div>
                </template>
                <div class="roleava avacss1">
                  <div
                    class="_myth"
                    v-if="
                      (val.sw_mythavamode == false) & (item2?.includes('myth') == true)
                    "
                  >
                    ꕥ
                  </div>
                  <img class="_img1" :src="cfg.function.ava(ct.tomyth(item2))" />
                </div>
              </template>
              <div class="_dmg_box">
                <template v-if="val.sw_fevermode == true">
                  <template v-if="parseInt(item.dxdata?.damage_fever) <= 0">
                    <span style="color: rgb(255, 144, 0)">{{
                      ct.get_dmg(item.dxdata.damage ?? 0, "fever", item.icon)
                    }}</span>
                  </template>
                  <template v-else>
                    {{ ct.get_dmg(item.dxdata.damage_fever ?? 0) }}
                  </template>
                </template>
                <template v-else>
                  {{ ct.get_dmg(item.dxdata.damage ?? 0) }}<span class="hide400">亿</span>
                </template>
              </div>
            </div>
            <div class="_user_box">
              <template v-for="item2 in item.list">
                <div class="_zybox" @click="ct.load_zy(item2, item)">
                  <n-icon size="12" :component="MdThumbsUp" />

                  <span>{{ item2.gj ?? 0 }}</span
                  ><span>{{ item2.user }}</span>
                </div>
              </template>
            </div>
          </div>
        </template>
        <div v-if="val.sw_fevermode == true" class="nbox3">
          [炽热模式] <span style="color: rgb(255 144 0)">x.xx</span> 生成伤害　<span
            style="color: var(--v2-tc-3)"
            >x.xx</span
          >
          玩家伤害
        </div>
      </div>
    </div>
  </div>
</template>

<style lang="css" scoped>
._zybox {
  display: flex;
  gap: 2px;
  justify-content: center;
  align-items: center;
}
.boss_box2 {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}

.zy_img {
  cursor: pointer;
  display: flex;
  height: 60px;
  overflow: hidden;
  position: relative;
  border-radius: 3px;
  background: var(--bg5);
  justify-content: center;
}

._myth {
  position: absolute;
  left: -7px;
  top: -9px;
  background-color: rgb(36 36 44 / 40%);
  font-size: 11px;
  padding-left: 3px;
  padding-right: 3px;
  padding-bottom: 2px;
  border-radius: 999px;
  color: #d2cc27;
  text-shadow: 0 0 3px #000;
}

._spantips {
  margin-left: 5px;
  border-radius: 999px;
  background-color: #6c6d7d;
  padding-left: 6px;
  padding-right: 6px;
  line-height: 17px;
  display: inline-block;
  cursor: pointer;
}

._dmg_box {
  display: flex;
  align-items: center;
  padding-left: 0.25em;
  justify-content: flex-end;
  font-size: 14px;
  color: var(--v2-tc-3);
  text-shadow: var(--v2-sd-3);
}

._user_box {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-direction: row;
  flex-wrap: wrap;
}

._swbox {
  background-color: #47485c;
  padding: 5px;
  border-radius: 5px;
  padding-left: 10px;
  padding-right: 10px;
}

.boxgap {
  container-type: inline-size;
}

._winzybox {
  container-type: inline-size;
}
._teamdiv {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
._teambox {
  padding: 0.6rem 0.5rem 0.6rem 0.5rem;
  border-radius: 0.35em;
  position: relative;
  background-color: var(--bg5);
  box-shadow: var(--b2-sd);
  border: var(--b2-bd);
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  gap: 0.75em;
  align-items: center;
}

._roleyc {
  width: 2.5em;
  height: 2.5em;
  position: relative;
  margin-right: 0.35em;
}

._roleyc ._yctext {
  position: absolute;
  bottom: 0;
  border-radius: 0px 0px 3px 4px;
  font-size: 0.9em;
  background-color: rgb(0 0 0 / 40%);
  text-align: center;
  color: #fff;
  text-shadow: 0 0 3px #000000;
  width: 2.75em;
  left: 0.15em;
}

._roleyc ._img1 {
  width: 100%;
  height: 100%;
  margin-top: -0.1em;
  background: var(--ava2-bg);
  padding: var(--ava2-pd);
  border: var(--ava2-border);
  border-radius: 5px;
}

._rolelist {
  display: flex;
  gap: 0.65em;
  align-items: center;
}

.roleava {
  width: 2.6rem;
  height: 2.6rem;
  position: relative;
}

.roleava ._img1 {
  width: 100%;
  height: 100%;
}

._iframe {
  width: 100%;
  height: 550px;
}

._sstag_box {
  gap: 0.75em;
}

._bossct_box {
  gap: 0.75rem;
}

._pcmw {
  max-width: 650px;
}

._topbtn_box {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.75em;
}

._bossct_box {
  display: grid;
  grid-template-columns: repeat(4, minmax(0px, 1fr));
}

.boss_ck {
  border: var(--nbox4-border3);
}
._box_div {
  display: flex;
  gap: 12px;
  background-color: var(--nbox3);
  padding: 8px;
  border-radius: 5px;
  padding-left: 12px;
  padding-right: 12px;
}
._sstag_box {
  display: grid;
  grid-template-columns: repeat(7, minmax(0px, 1fr));
}

@media (max-width: 500px) {
  ._sstag_box {
    display: grid;
    grid-template-columns: repeat(4, minmax(0px, 1fr));
  }

  ._sstag_box > .m_tagbox:last-child {
    grid-column: span 2;
  }

  ._winzybox ._box_div {
    width: 100%;
    justify-content: center;
  }

  ._winzybox ._box1 {
    padding-left: 0 !important;
    padding-right: 0;
  }

  ._teambox {
    display: flex;
    flex-direction: column;
    align-items: center;
    flex-wrap: wrap;
    align-content: center;
  }

  ._user_box {
    width: 100%;
    margin-top: 4px;
    justify-content: center;
    gap: 8px;
  }

  ._swflex {
    justify-content: center !important;
    font-size: 0.9em;
  }

  ._swbox {
    padding: 5px;
    padding-left: 5px;
    padding-right: 5px;
  }

  ._swbox .n-flex {
    align-items: center;
  }
  .zy_img {
    height: 3.75rem;
  }

  ._topbtn_box {
    display: grid;
    grid-template-columns: repeat(3, minmax(0px, 1fr));
    gap: 0.75em;
  }
}
@media (max-width: 428px) {
  .roleava {
    width: 11vw;
    height: 11vw;
    overflow: hidden;
  }
  ._roleyc {
    width: 11vw;
    height: 11vw;
  }
  .zy_img {
    height: 14vw;
  }
  ._bossct_box {
    gap: 1.5vw;
  }
  ._rolelist {
    gap: 2vw;
  }
  ._roleyc ._yctext {
    position: absolute;
    font-size: 3.25vw;
    height: 5vw;
    width: 10.5vw;
    left: 1vw;
    bottom: 1.2vw;
  }
  ._teambox {
    font-size: 4.5vw;
  }
  ._dmg_box {
    padding-left: 0;
    font-size: 4.5vw;
  }
  ._zybox {
    font-size: var(--btm-n-font-size);
    padding: var(--btm-n-padding);
  }
  ._textdiv {
    padding: 5vw !important;
  }
  ._workdiv {
    font-size: var(--def-12px);
  }
  ._iframe {
    height: 53vw !important;
  }
  ._box_div {
    display: flex;
    gap: var(--def-12px);
    padding: var(--def-8px);
    border-radius: 5px;
    font-size: var(--def-12px);
    width: 100%;
    box-sizing: border-box;
    align-items: center;
  }
  ._workdiv img {
    width: var(--def-rolepx);
    height: var(--def-rolepx);
    border-radius: 5px;
    background: var(--ava2-bg);
    padding: var(--ava2-pd);
    border: var(--ava2-border);
  }
}
</style>
<script>
import { MdThumbsUp } from "@vicons/ionicons4";
import { ScanThumbUp16Filled } from "@vicons/fluent";
import { cfg } from "@/cfg/cfg.js";
import img_wucai from "@/assets/img/战士.png";
import img_fire from "@/assets/img/火属性.png";
import img_water from "@/assets/img/水属性.png";
import img_land from "@/assets/img/土属性.png";
import img_light from "@/assets/img/光属性.png";
import img_dark from "@/assets/img/暗属性.png";
import img_void from "@/assets/img/虚属性.png";
import img_repel from "@/assets/img/击飞.png";
import img_down from "@/assets/img/击倒.png";
import img_hurt from "@/assets/img/重伤.png";
import img_bei from "@/assets/img/杯.png";
import img_shu from "@/assets/img/书.png";
import img_yqn from "@/assets/img/不填.png";
import { getrole, getbossv2 } from "@/cfg/function.js";
import edit from "./raids_zy/edit.vue";
import olist from "./gb_raids_olist.vue";

export default {
  props: {
    load: {
      type: Boolean,
      required: false,
    },
  },
  emits: ["update_load"],
  setup(props, { emit }) {
    const ct = {
      //boss模式选择首领
      click_bossmodesl: (boss) => {
        val.ck_boss = boss;
        ct.click_boss(val.ck_boss, val.boss_em ?? ["五彩"]);
      },
      //在往期一览中获取作业
      load_oldzy: async (obj) => {
        try {
          val.mode = "season";
          val.data = [];
          val.ck_boss = null;
          val.boss_em = null;
          val.click_season = obj.season;
          val.win_olist = false;
          await ct.get_bosslist(val.click_season);
          await ct.click_boss(obj.boss, obj.em);
        } catch (error) {
          cfg.alert3({
            title: "获取失败",
            message: `${error.message}`,
            closeOnClickOverlay: true,
          });
        }
      },
      //切换模式
      modesw: () => {
        const alt = cfg
          .alert2({
            confirmButtonText: "赛季模式",
            cancelButtonText: "首领模式",
            confirmButtonColor: "black",
            closeOnClickOverlay: true,
            destroyOnClose: true,
            keyboardEnabled: false,
            title: "选择模式",
            allowHtml: true,
            message:
              "请选择要切换的模式，默认选择赛季模式\n\n<b>赛季模式：</b>按照赛季选择BOSS\n<b>首领模式：</b>可选择所有BOSS",
          })
          .then(async () => {
            val.data = [];
            val.ck_boss = null;
            val.boss_em = null;
            val.mode = "season";
          })
          .catch(() => {
            val.data = [];
            val.ck_boss = null;
            val.boss_em = null;
            val.mode = "boss";
          });
      },
      //提交投稿视频作业
      post_new: async () => {
        try {
          const data = val.ldata3;
          val.edit_loading = true;

          //检查作者名称
          if (data.user == null) {
            throw { code: -1, message: `作者名称未填写` };
          }

          //检查视频地址
          if (data.bv?.length >= 1) {
            const bvurl = data.bv;

            //检查url是否包含字符串b23.tv
            if (bvurl.includes("b23.tv")) {
              const back = await cfg.mget({
                url: `${cfg.url2}api/raids_zy`,
                query: {
                  type: "getb23",
                  url: bvurl,
                },
              });
              if (back.code == 0) {
                const bdata = back.data;
                data.bv = bdata.finalUrl;
              }
            }

            //如果包含video/bv把bv替换成BV
            if (data?.bv?.includes("video/bv")) {
              data.bv = data?.bv?.replace("video/bv", "video/BV");
            }

            //截取BV
            const videoIdRegex = /BV[a-zA-Z0-9]+/;
            if (videoIdRegex.test(data?.bv)) {
              const videoIdMatch = data?.bv.match(videoIdRegex);
              const videoId = videoIdMatch[0]; // 获取匹配到的视频ID
              data.bv = videoId;
            } else {
              cfg.alert3({
                message: `视频地址识别失败`,
                closeOnClickOverlay: true,
              });
              return false;
            }
          } else {
            throw { code: -1, message: `未填写视频地址\n只支持B站视频` };
          }

          //检测队伍属性选择
          if (data.tl == null) {
            throw { code: -1, message: `未选择队伍属性` };
          }

          //检查投稿角色数量
          for (let i = 0; i < data.objrole.length; i++) {
            const data2 = data.objrole[i];
            if (data2.i == null) {
              throw { code: -1, message: `第${i + 1}个角色未选择` };
            }
          }

          //提交作业
          const back = await cfg.mpost({
            url: `${cfg.url2}api/raids_zy`,
            query: {
              type: "new_videozy",
            },
            post: {
              user: {
                uid: cfg.user?.uid,
                authkey: cfg.user?.authkey,
                token: cfg.user?.token,
              },
              data: val.ldata3,
            },
          });

          if (back.code == 0) {
            //把data.user保存到浏览器Cookie
            localStorage.setItem("raids_user", data.user);

            val.edit_loading = false;
            val.win_new = false;
            ct.click_boss(val.ck_boss, val.boss_em);
          } else {
            throw { code: -1, message: back.msg };
          }

          return;
        } catch (error) {
          val.edit_loading = false;
          cfg.alert3({
            title: "作业投稿失败",
            message: `${error.message}`,
            closeOnClickOverlay: true,
          });
        }
      },
      //投稿信视频轴按钮
      click_new: () => {
        if (cfg.user?.authkey != null) {
          //读取浏览器Cookie
          const user = localStorage.getItem("raids_user") ?? null;
          val.ldata3 = {
            season: val.click_season,
            edit_type: "new",
            fp: 1,
            yq: "不填",
            user: user,
            boss_list: val.boss_list,
            boss_click: val.ck_boss,
          };
          val.win_new = true;
        } else {
          cfg
            .alert2({
              title: "请登录工具箱账号后投稿作业",
              message: "请登录工具箱账号后投稿作业",
              confirmButtonText: "现在登录",
            })
            .then(async () => {
              cfg.loginif = true;
            })
            .catch(() => {
              // on cancel
            });
        }
      },
      //字符串转换
      toqte: (str) => {
        //获取字符串中 <qte></qte>的内容
        let qte = str.match(/<qte>([\s\S]*?)<\/qte>/);
        qte = qte[1];
        console.log(qte, str);
        return str;
      },
      //保存编辑作业
      save_edit: async () => {
        try {
          const back = await cfg.mpost({
            url: `${cfg.url2}api/raids_zy`,
            query: {
              type: "edit_videozy",
            },
            post: {
              user: {
                uid: cfg.user?.uid,
                authkey: cfg.user?.authkey,
                token: cfg.user?.token,
              },
              data: val.ldata3,
            },
          });
          if (back.code == 0) {
            val.win_zy = false;
            val.win_edit = false;
            ct.click_boss(val.ck_boss, val.boss_em);
          } else {
            cfg.alert3({
              message: back.msg,
            });
          }
        } catch (error) {
          cfg.alert3({
            message: `发生错误\n错误原因: team_ghz[save_edit] @ ${error.message}\n请截图给开发者修复。`,
            closeOnClickOverlay: true,
          });
        }
      },
      //点击编辑按钮
      editopfunc: async (type) => {
        try {
          switch (type) {
            //编辑视频轴
            case "edit": {
              const data = val.ldata2;
              if (cfg.qxpd(["user", "bz"], data.uid) == true) {
                val.ldata3 = {
                  ...val.ldata2,
                  user: val.ldata.user,
                  icon: val.ldata.icon,
                  edit_type: "edit",
                };
                val.win_edit = true;
              } else {
                cfg.alert3({
                  message: "权限不足，无法编辑\n权限要求：[管理员，上传者]",
                  closeOnClickOverlay: true,
                });
              }
              break;
            }
            //删除视频轴
            case "delete": {
              const data = val.ldata2;
              if (cfg.qxpd(["user", "bz"], data.uid) == true) {
                cfg
                  .alert2({
                    title: "操作提示",
                    message: "要删除本轴吗？\n权限要求【管理员、上传者、同IP游客】",
                  })
                  .then(async () => {
                    const back = await cfg.mpost({
                      url: `${cfg.url2}api/raids_zy`,
                      query: {
                        type: "delete_videozy",
                      },
                      post: {
                        user: {
                          uid: cfg.user?.uid,
                          authkey: cfg.user?.authkey,
                          token: cfg.user?.token,
                        },
                        data: {
                          id: data.id,
                        },
                      },
                    });
                    if (back.code == 0) {
                      cfg
                        .alert3({
                          message: back.msg,
                        })
                        .then(() => {
                          val.win_zy = false;
                          val.iframe = false;
                          ct.click_boss(val.ck_boss, val.boss_em);
                        });
                    } else {
                      cfg.alert3({
                        message: back.msg,
                      });
                    }
                  })
                  .catch(() => {
                    // on cancel
                  });
              } else {
                cfg.alert3({
                  message: "权限不足，无法删除\n权限要求：[管理员，上传者]",
                  closeOnClickOverlay: true,
                });
              }

              break;
            }
            //编辑移出旧轴
            case "oldzy": {
              const data = val.ldata2;
              const alertfunc = async () => {
                const back = await cfg.mpost({
                  url: `${cfg.url2}api/raids_zy`,
                  query: {
                    type: "set_old",
                  },
                  post: {
                    user: {
                      uid: cfg.user?.uid,
                      authkey: cfg.user?.authkey,
                      token: cfg.user?.token,
                    },
                    data: {
                      id: data.id,
                      oldwork: data.oldwork,
                    },
                  },
                });
                if (back.code == 0) {
                  cfg
                    .alert3({
                      message: back.msg,
                    })
                    .then(() => {
                      val.win_zy = false;
                      val.iframe = false;
                      ct.click_boss(val.ck_boss, val.boss_em);
                    });
                } else {
                  cfg.alert3({
                    message: back.msg,
                  });
                }
              };
              if (data.oldwork == true) {
                cfg
                  .alert2({
                    title: "操作提示",
                    message: "要移出旧轴列表吗？移除后恢复作业显示（仅管理员可操作）",
                  })
                  .then(() => {
                    alertfunc();
                  })
                  .catch(() => {
                    // on cancel
                  });
              } else {
                cfg
                  .alert2({
                    title: "操作提示",
                    message: "要设置为旧轴吗？设置后作业默认隐藏（仅管理员可操作）",
                  })
                  .then(async () => {
                    alertfunc();
                  })
                  .catch(() => {
                    // on cancel
                  });
              }
              break;
            }
          }
        } catch (error) {
          cfg.alert3({
            message: `发生错误：\n错误函数: editopfunc\n错误原因: ${error.message}\n请截图给开发者修复。`,
            closeOnClickOverlay: true,
          });
        }
      },
      //重新排序数据
      px_dmg: (bl) => {
        if (val.ck_boss == null) {
          if (val.px_dmgmode == true) {
            val.px_dmgmode = false;
          } else {
            val.px_dmgmode = true;
          }
          cfg.alert3({
            message: `选择BOSS再进行排序操作`,
            closeOnClickOverlay: true,
          });
          return false;
        }
        if (bl == true) {
          //val.data的数据根据val.data[k].dmg大小排序
          val.data.sort((a, b) => {
            return b.dmg - a.dmg; // 升序排序
          });
        } else {
          val.data.sort((a, b) => {
            return b.gj - a.gj; // 升序排序
          });
          //否则的话按照最大点赞数排序
        }
      },
      //隐藏旧轴滑块
      updhidemode: (bl) => {
        if (val.ck_boss != null) {
          ct.click_boss(val.ck_boss, val.boss_em);
        }
      },
      //选择boss属性
      click_embtn: async (em) => {
        try {
          if (val.ck_boss == null) {
            throw { code: -1, message: `请选择BOSS后选择调整属性` };
          } else {
            if (ct.isstr(em, val.ck_em) == true) {
              //val.ck_em中删除该属性
              if (val.ck_em.length <= 1) {
                cfg.alert.error({
                  title: "无法取消",
                  content: `至少保留一个属性`,
                });
                return false;
              }
              val.ck_em.splice(val.ck_em.indexOf(em), 1);
            } else {
              val.ck_em.push(em);
            }
            console.log(val.ck_em);

            await ct.click_boss(val.ck_boss, val.boss_em);
          }
        } catch (error) {
          cfg.alert3({
            title: "选择失败",
            message: `${error.message}`,
            closeOnClickOverlay: true,
          });
        }
      },
      modeop: [
        {
          label: "[默认]赛季模式",
          value: "season",
        },
        {
          label: "首领模式",
          value: "boss",
        },
      ],
      editop: [
        {
          label: "编辑该作业",
          value: "edit",
        },
        {
          label: "删除该作业",
          value: "delete",
        },
        {
          label: "移除/设置为旧轴",
          value: "oldzy",
        },
      ],
      ss: ["五彩", "火", "水", "土", "光", "暗", "虚"],
      img: {
        五彩: img_wucai,
        火: img_fire,
        水: img_water,
        土: img_land,
        光: img_light,
        暗: img_dark,
        虚: img_void,
        击倒: img_down,
        重伤: img_hurt,
        击飞: img_repel,
        杯: img_bei,
        书: img_shu,
        不填: img_yqn,
      },
      //匹配字符串是否在数组
      isstr: (str, arr) => {
        if (arr.some((item) => item.includes(str))) {
          return true;
        } else {
          return false;
        }
      },
      //作业分P tab切换
      load_zyvan: (fp) => {
        fp = parseInt(fp.name);
        ct.load_zy2(fp);
        return;
      },
      //自动加载视频开关
      updloadvideo: (sw) => {
        if (sw == false) {
          val.ckvideo = false;
          localStorage.setItem("team_ghz_autovideo", "false");
        } else {
          localStorage.setItem("team_ghz_autovideo", "true");
        }
      },
      //弹出窗口并且读取作业
      load_zy: (zy, arricon) => {
        val.zyname = `查看（${zy.user}）作业合集`;
        val.win_zy = true;
        val.iframe = false;
        val.ldata = { ...zy, icon: arricon.icon };
        val.ckp = 0;
        val.ckvideo = false;
        ct.load_zy2(val.ckp);
        //等待1秒
        setTimeout(() => {
          val.iframe = true;
        }, 200);
        return val.ckp;
      },
      //读取分P作业
      load_zy2: (fp) => {
        val.ldata2 = val.ldata.data[fp];
        return val.ldata2;
      },
      //开花设置记忆
      updmyth: (set) => {
        //开关保存到浏览器
        if (set == true) {
          localStorage.setItem("team_ghz_myth", "true");
        } else {
          localStorage.setItem("team_ghz_myth", "false");
        }
      },
      //开花头像转换
      tomyth: (iconurl) => {
        //去掉字符串的_myth
        if (val.sw_mythavamode == false) {
          return iconurl.replace("_myth", "");
        } else {
          return iconurl;
        }
      },
      //重置刀型伤害排名
      del_dxdmg: async () => {
        try {
          if (val.ck_boss == null) {
            cfg.alert.error({
              title: "ERROR！",
              content: `获取boss失败`,
            });
            return false;
          }
          if (val.boss_em == null) {
            cfg.alert.error({
              title: "ERROR！",
              content: `获取属性失败`,
            });
            return false;
          }
          let res = await cfg.axios.get(`${cfg.url}`, {
            params: {
              t: "v2/get",
              t2: "gt/work",
              t3: "del_dxtop",
              boss: val.ck_boss, //boss名称
              em: val.boss_em, //队伍属性数组
              uid: cfg.user.uid,
              authkey: cfg.user.authkey,
            },
          });
        } catch (error) {
          cfg.alert.error({
            title: "ERROR！",
            content: `${error}`,
          });
          return false;
        }
      },
      //计算亿伤害
      get_dmg: (damage, type, icon) => {
        if (damage <= 0) {
          return `无数据`;
        } else {
          if (type == "fever") {
            //特殊角色银河变量
            let dkb = false;

            //检查boss束胸是否选择
            if (val.boss_em != null) {
              //获取boss克制属性
              const kz = ct.kzgroup[val.boss_em];

              //读取队伍信息
              for (let index = 0; index < icon.length; index++) {
                const data = cfg.role_icon[icon[index]];
                //如果是非克制角色，跳过计算
                if (kz != data.shu) {
                  //如果是开花银河继续计算
                  if (icon[index] == "dokkaebi_myth.png") {
                    dkb = true;
                    continue;
                  } else {
                    return `非克制`;
                  }
                }
              }
            }

            //检查银河是否在队伍中
            if (dkb == true) {
              //如果是3克制+银河
              damage = damage * 1.135;
            } else {
              //不是的话按照4克制计算
              damage = damage * 1.155;
            }
          }
          return ((damage ?? 0) / 100000000)
            ?.toString()
            .match(/^-?\d+(?:\.\d{0,2})?/)?.[0];
        }
      },
      //克制关系
      kzgroup: {
        光: "虚",
        暗: "光",
        虚: "暗",
        火: "水",
        水: "土",
        土: "火",
        五彩: "五彩",
      },
      //获取武器异常值
      get_wpycz: (icon, type) => {
        try {
          const role = cfg.role_icon[icon];
          const data = type.data[0].weapon[icon];
          if (data == null) {
            return false;
          } else {
            let ycz = 0;
            let ycl = "";
            if (data == "本专") {
              ycz = role.yc;
              ycl = role.ycl;
            } else {
              if (data == "二专") {
                ycz = role.yc2;
                ycl = role.ycl2;
              } else {
                return false;
              }
            }
            const boss = cfg.bossnamelist[val.ck_boss];
            if (boss[ycl] != null) {
              return (ycz * boss[ycl]).toFixed(1);
            } else {
              return false;
            }
          }
        } catch (error) {
          return false;
        }
      },
      //获取武器异常类型
      get_wpycl: (icon, type) => {
        try {
          const role = cfg.role_icon[icon];
          const data = type.data[0].weapon[icon];
          if (data == null) {
            return false;
          } else {
            if (data == "本专") {
              return role.ycl;
            } else {
              if (data == "二专") {
                return role.ycl2;
              } else {
                return false;
              }
            }
          }
        } catch (error) {
          return false;
        }
      },
      //获取boss作业
      click_boss: async (boss, em) => {
        try {
          if (val.zy_loading == true) {
            return false;
          }
          //loading动画
          val.zy_loading = true;
          //如果填写了BOSS属性，则返回克制队伍属性。
          if (val.boss_em != em) {
            val.ck_em = ["五彩", ct.kzgroup[em]];
          }

          let hmint = 0;
          if (val.sw_hidemode == true) {
            hmint = 1;
          }
          let res = await cfg.axios.get(`${cfg.url2}api/raids_zy`, {
            params: {
              type: "zy_list",
              boss: boss, //boss名称
              em: val.ck_em, //队伍属性数组
              hidemode: hmint, //是否隐藏旧轴
              season: val.click_season, //赛季ID 未指定显示总点赞数
              bossem: em, //boss属性 未指定不显示刀型排名
            },
          });

          val.boss_em = em;
          //关闭loading动画
          val.zy_loading = false;
          //保存变量
          val.ck_boss = boss;
          if (res.data.code == 0) {
            const data = res.data.data;
            const vd = data.video ?? []; //视频轴
            const cd = data.chain ?? []; //文字轴
            const dd = data.dxdmg ?? []; //刀型伤害
            let td = {};
            //添加视频作业
            for (let index = 0; index < vd.length; index++) {
              const item = vd[index];
              const teamid = item.team_id;
              if (td[teamid] == null) {
                td[teamid] = {
                  icon: item.icon,
                  list: {},
                  team_id: teamid,
                  dxdata: {},
                  dmg: 0,
                  gj: 0,
                };
              }
              if (td[teamid].list[item.user] == null) {
                td[teamid].list[item.user] = {
                  user: item.user,
                  gj: 0,
                  data: [],
                };
              }
              td[teamid].list[item.user].data.push({
                ...item,
                vt: "video",
                fp: parseInt(item.fp),
                gj: parseInt(item.gj),
                id: item._id,
              });
              if (item.gj >= td[teamid].gj) {
                td[teamid].gj = item.gj;
              }
              if (item.gj >= td[teamid].list[item.user].gj) {
                td[teamid].list[item.user].gj = item?.gj ?? 0;
              }
            }
            //添加刀型排名
            for (let index = 0; index < dd.length; index++) {
              const item = dd[index];
              const teamid = item.team_id;
              if (td[teamid] == null) {
                continue;
              }
              if (teamid == null) {
                continue;
              }
              td[teamid].dxdata = item;
              td[teamid].dmg = item?.damage ?? 0;
            }

            //转为数组
            td = Object.values(td);
            //把list转为数组
            for (let index = 0; index < td.length; index++) {
              td[index].list = Object.values(td[index].list);
            }
            //重新排序
            for (let index = 0; index < td.length; index++) {
              let sortdata = td[index].list;
              sortdata.sort((a, b) => {
                return b.gj - a.gj;
              });
              td[index].list = sortdata;
            }
            val.data = td;
            ct.px_dmg(val.px_dmgmode);
            return;
            for (let index = 0; index < cd.length; index++) {
              const item = cd[index];
              const teamid = item.team_id;
              td[teamid].clist.push(item);
            }
          } else {
            cfg.alert.error({
              title: "ERROR！",
              content: `获取boss数据失败，${res.data.msg}`,
            });
          }
        } catch (error) {
          console.log(error);
          cfg.alert.error({
            title: "致命错误！",
            content: `[get_season] ${error}，请尝试刷新页面或截图开发者`,
          });
        }
      },
      //获取赛季信息
      get_season: async (type) => {
        try {
          let res = await cfg.axios.get(`${cfg.url2}api/raids_zy`, {
            params: {
              type: "season_list",
            },
          });
          if (res.data.code == 0) {
            const data = res.data.data;
            val.season_list = [];
            data.forEach((item, key) => {
              if (key == 0) {
                val.newseason = item.season;
              }
              if (item.season >= 84) {
                val.season_list.push({
                  label: `${item.season}赛季 ${item.name} S2 ${item.stime}`,
                  value: item.season,
                });
              } else {
                val.season_list.push({
                  label: `${item.season}赛季 ${item.name} S1 ${item.stime}`,
                  value: item.season,
                });
              }
            });
            val.click_season = val.season_list[0].value;
          } else {
            cfg.alert.error({
              title: "ERROR！",
              content: `${res.data.msg}`,
            });
          }
        } catch (error) {
          cfg.alert3({
            message: `发生错误：@get_season ${error.message}`,
            closeOnClickOverlay: true,
          });
        }
      },
      //获取赛季boss列表
      get_bosslist: async (season) => {
        try {
          if (season == null) {
            season = val.click_season;
          }
          let res = await cfg.axios.get(`${cfg.url2}api/raids_zy`, {
            params: {
              type: "season_boss",
              season: val.click_season,
            },
          });
          val.data = [];
          val.ck_boss = null;
          val.boss_em = null;
          if (res.data.code == 0) {
            val.boss_list = [];
            const data = res.data.data;
            for (let index = 0; index < data.length; index++) {
              const item = data[index];
              val.boss_list.push(item);
            }
          } else {
            cfg.alert.error({
              title: "ERROR！",
              content: `${res.data.msg}`,
            });
          }
        } catch (error) {
          cfg.alert3({
            message: `发生错误：@get_bosslist ${error.message}`,
            closeOnClickOverlay: true,
          });
          return -1;
        }
      },
      //点击赛季选择器
      click_seaosn: async (id) => {
        await ct.get_bosslist(id);
        cfg.router.replace({
          query: {
            s: id,
          },
        });
      },
    };

    const query = cfg.route.query;
    //读取team_ghz_myth的缓存
    let set_myth = localStorage.getItem("team_ghz_myth") ?? true;
    let set_autovideo = localStorage.getItem("team_ghz_autovideo") ?? true;
    if (typeof set_myth == "string") {
      set_myth = set_myth === "false" ? false : true;
    }
    if (typeof set_autovideo == "string") {
      set_autovideo = set_autovideo === "false" ? false : true;
    }

    const val = reactive({
      click_season: query.s ?? null,
      zy_loading: false,
      px_dmgmode: false,
      ck_em: [],
      newseason: 0,
      zyname: "未命名",
      sw_loadvideo: set_autovideo, //自动加载视频
      sw_mythavamode: set_myth,
      sw_bossmode: false, // false 赛季模式 true 自选首领
      sw_hidemode: false, //true 隐藏旧轴 false 显示旧轴
      sw_dmgmode: false, //false 普通伤害 true 炽热伤害
      ck_boss: null, //赛季模式选中的boss
      win_zy: false,
      iframe: false,
      win_edit: false,
      ldata: {}, //读取的作业
      ldata2: {},
      ldata3: {},
      edit_loading: false,
      ckp: 0,
      bossmode_list: [],
      boss_list: [],
      season_list: [],
    });
    onMounted(async () => {
      await getrole();
      await getbossv2();
      await ct.get_season();
      await ct.get_bosslist();
      for (let index = 0; index < cfg.bosslist.length; index++) {
        const data = cfg.bosslist[index];
        val.bossmode_list.push({
          label: data.name,
          value: data.name,
        });
      }
      if (cfg.route?.query?.share == "olist") {
        const q = cfg.route.query;
        val.click_season = parseInt(q.s);
        const b = await ct.get_bosslist(val.click_season);
        if (b == -1) {
          return;
        }
        await ct.click_boss(q.boss, q.em);
        //去掉router的query
        cfg.router.replace({
          query: {
            s: q.s,
          },
        });
      }
      emit("update_load", false);
    });
    return { olist, cfg, ct, val, edit, MdThumbsUp, ScanThumbUp16Filled };
  },
};
</script>
<style scoped>
._jsbox {
  container-type: inline-size;
}

._videobox {
  display: grid;
  grid-template-columns: repeat(3, minmax(0px, 1fr));
  border-radius: 0.35em;
}

._iframediv {
  grid-column: span 2;
  padding: 1em;
  background-color: var(--nbox2);
  gap: 8px;
  display: flex;
  flex-direction: column;
}

._textdiv {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  padding: 0.5em;
  background-color: var(--nbox2);
}

@container (max-width: 850px) {
  ._videobox {
    grid-template-columns: repeat(1, minmax(0px, 1fr));
  }

  ._iframediv {
    grid-column: span 1;
    padding: 0.35em;
  }

  ._iframe {
    height: 350px;
  }
}

@container (max-width: 675px) {
  ._iframediv {
    padding: 0em;
    padding-top: 6px;
    border-right: none;
    background: none;
  }

  ._videobox {
    grid-template-columns: repeat(1, minmax(0px, 1fr));
    padding: 0.5em;
  }

  ._iframe {
    height: 400px;
  }
  ._textdiv {
    margin-top: 12px;
  }
}

.dmg_text {
  padding-left: 5px;
  font-size: 14px;
  color: var(--v2-tc-3);
  text-shadow: var(--v2-sd-3);
  width: 50px;
  text-align: right;
}

.dmg_text_na {
  color: #4ef1ba;
}

.work_yw {
  position: absolute;
  top: -2px;
  left: -2px;
  color: #fff;
  font-size: 11px;
  padding-left: 2px;
  padding-right: 2px;
  border-radius: 30px;
  text-align: center;
  background-color: #000000;
}

.work_wp {
  max-height: 44px;
  background-image: linear-gradient(
    to bottom,
    #2f343b 0%,
    #2f343b 50%,
    #45533e 90%,
    #8be31d 100%
  );
  padding: 3px;
  width: 44px;
  height: 44px;
  border: solid 2px #727b92;
  margin-right: 2px;
  border-radius: 5px;
}
</style>
